"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.StatisticUnit = void 0;
var template = "\n<div class='statistic-container'>\n    <div class='statistic-header'>\n        <span class='header-target'>Target</span>\n        <span class='header-value'>Min</span>\n        <span class='header-value'>Max</span>\n        <span class='header-value'>Avg</span>\n        <span class='header-value' title='Current'>Cur</span>\n    </div>\n    <div class='statistic-body'>\n        <ul class='statistic-list'>\n            <li>\n                <span></span>\n                <span></span>\n                <span></span>\n                <span></span>\n                <span></span>\n            <li>\n        </ul>\n    </div>\n</div>";
var unSelectName = 'unselect';
var onlySelectedTarget = '';
var StatisticUnit = /** @class */ (function () {
    function StatisticUnit(myChart, $info, div) {
        this.myChart = myChart;
        this.$info = $info;
        this.div = div;
        $info.html(template);
        this.$statisticList = $info.find('.statistic-list');
        this.fixContentWidth();
        this.curSelected = this.myChart.getOption().legend[0].selected;
        this.bindHoverEvent();
    }
    StatisticUnit.prototype.fixContentWidth = function () {
        this.$statisticList.width(this.$info.find('.statistic-container').width() - 17);
    };
    StatisticUnit.prototype.bindHoverEvent = function () {
        var _this = this;
        this.$statisticList.on('mouseenter', '.statistic-target', function (e) {
            var targetName = $(e.target).text();
            _this.myChart.dispatchAction({
                type: 'highlight',
                seriesName: targetName
            });
        });
        this.$statisticList.on('mouseout', '.statistic-target', function (e) {
            var targetName = $(e.target).text();
            _this.myChart.dispatchAction({
                type: 'downplay',
                seriesName: targetName
            });
        });
        this.$statisticList.on('click', '.statistic-target', function (e) {
            var _a;
            var curEchartOption = _this.myChart.getOption();
            var allTargetNames = (_a = curEchartOption.series) === null || _a === void 0 ? void 0 : _a.map(function (a) { return a.name; });
            if (_this.$statisticList.find('li.' + unSelectName).length > 0 && !$(e.target).closest('li').hasClass(unSelectName)) {
                _this.curSelected = {};
                for (var _i = 0, _b = allTargetNames; _i < _b.length; _i++) {
                    var cur = _b[_i];
                    _this.curSelected[cur] = true;
                }
                onlySelectedTarget = '';
            }
            else {
                _this.curSelected = {};
                for (var _c = 0, _d = allTargetNames; _c < _d.length; _c++) {
                    var cur = _d[_c];
                    _this.curSelected[cur] = false;
                }
                var targetName = $(e.target).text();
                _this.curSelected[targetName] = _this.curSelected[targetName] === undefined ? false : !_this.curSelected[targetName];
                onlySelectedTarget = targetName;
            }
            _this.myChart.setOption({
                legend: {
                    selected: _this.curSelected
                }
            });
            _this.calcStatistic();
        });
    };
    StatisticUnit.prototype.calcStatistic = function () {
        var _this = this;
        var curSeries = this.myChart.getOption().series;
        var $insertList = curSeries.map(function (item) {
            var vals = item.data.map(function (a) { return a[1]; });
            var curLiClassName = _this.curSelected[item.name] === false ? unSelectName : "";
            if (item.name === onlySelectedTarget) {
                curLiClassName += ' onlySelected';
            }
            if (vals.length <= 0) {
                return $();
            }
            var min = Math.min.apply(_this, vals).toFixed(2);
            var max = Math.max.apply(_this, vals).toFixed(2);
            var avg = (vals.reduce(function (sum, curVal) {
                return sum + curVal;
            }) / vals.length).toFixed(2);
            var cur = vals[vals.length - 1].toFixed(4);
            var $curLi = $("\n<li class='" + curLiClassName + "'>\n    <span class='statistic-target' title='" + _this.safeHtml(item.name) + "'>" + _this.safeHtml(item.name) + "</span>\n    <span class='statistic-value' title='" + min + "'>" + min + "</span>\n    <span class='statistic-value' title='" + max + "'>" + max + "</span>\n    <span class='statistic-value' title='" + avg + "'>" + avg + "</span>\n    <span class='statistic-value' title='" + cur + "'>" + cur + "</span>\n</li>");
            return $curLi;
        });
        this.$statisticList.empty();
        this.$statisticList.append($insertList);
        // var html = this.$statisticList.html();
        // this.$statisticList.append(html);
        // this.$statisticList.append(html); this.$statisticList.append(html); this.$statisticList.append(html); this.$statisticList.append(html); this.$statisticList.append(html); this.$statisticList.append(html);
    };
    StatisticUnit.prototype.safeHtml = function (str) {
        return $('<div/>').text(str).html();
    };
    return StatisticUnit;
}());
exports.StatisticUnit = StatisticUnit;
